<template>
  <a-modal
    title="分成比例"
    :width="800"
    :visible="modalMisible"
    :plain="true"
    :rules="rules"
    :model="forms"
    @ok="submitOk"
    @cancel="modalMisible=false"
  >
    <a-form :form="form">
      <a-form-item
        label="图文问诊价格"
        :required="true"
        :labelCol="labelCol"
        :wrapperCol="wrapperCol"
        hasFeedback
        validateStatus="success">
         <a-input placeholder="请输入价格" prefix="$" :min="0" :max="1000" type="number" v-model.number="forms.textMoney" />
      </a-form-item>
      <a-form-item
        label="视频问诊价格"
        :required="true"
        :labelCol="labelCol"
        :wrapperCol="wrapperCol"
        hasFeedback
        validateStatus="success">

        <a-input placeholder="请输入价格" :min="0" :max="1000" prefix="$" type="number" v-model.number="forms.videoMoney" />
      </a-form-item>
      <a-form-item
        label="问诊分成比例"
        :labelCol="labelCol"
        :wrapperCol="wrapperCol"
        prop="share"
        required
        hasFeedback
      >
        <a-input placeholder="请输入价格" prefix="%"  :min="0" :max="100" type="number" v-model.number="forms.share" />
      </a-form-item>
     <a-row>
       <!-- <a-col :span="24" style="display: flex; margin-left: 20px;">
         <a-form-item
           label="挂号分成比例"
           :required="true"
           :labelCol="labelCols"
           :wrapperCol="wrapperCols"
           validateStatus="success">
           <a-input-number :min="0"
                           :max="100"
                           :formatter="value => `${value}%`"
                           :parser="value => value.replace('%', '')"
                           @change="onChange"
                           v-model.number="forms.registerRatio"
                           style="margin-right: 170px;width: 140px"
           />
         </a-form-item>
       </a-col> -->
     </a-row>
    </a-form>
  </a-modal>
</template>

<script>
import { httpAction, getAction,putAction } from '@api/manage'

export default {
  name: 'SysCheckRuleTestModal',
  inject: ['reload'],

  data() {
    return {
      title: '分成比例',
      modalMisible: false,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },

      labelCols: {
        xs: { span: 12 },
        sm: { span: 8 },
      },
      wrapperCols: {
        xs: { span: 12 },
        sm: { span: 10 },
      },

      forms:{
        id: '',
        videoMoney: '',
        textMoney: '',
        share:'',
        registerRatio:'',
      },
      form: this.$form.createForm(this),
      validatorRules: {
        share: {
          rules: [
            { required: true, message: '请输入数字值'},
          ]
        },

      },


      url: {
        list: "/doctor/doctor/configEdit",
        info: "/doctor/doctor/getConfig",
      },
    }
  },
  created() {
    this.open();
  },
  methods: {
    open(record) {
      let attr = {};
      attr.id = record.id;

      getAction(this.url.info, attr).then(res => {
        this.forms = res.result;
      })

      this.modalMisible = true
    },

    submitOk () {
      putAction(this.url.list, this.forms).then((res)=>{
        if(res){
          this.$message.success(res.message)
          this.reload()
        }else{
          this.$message.warning(res.message)
        }
      }).catch((error)=>{
        console.log(error);
      })
    },

    onChange(value) {
      console.log('changed', value);
    },


  }
}
</script>

<style lang="less" scoped>
  .ant-input-number {
    margin-right: 20px;
    width: 360px;
  }

</style>